<!DOCTYPE html>
<html>
<head>
    <% include ../common/meta.ejs %>
    <% include ../common/public.ejs %>
    <link href="//cdn.bootcss.com/bootstrap-datepicker/1.6.1/css/bootstrap-datepicker.min.css" rel="stylesheet">
    <link href="<%= global.config.publicPath %>/jquery-file-upload/css/jquery.fileupload.css" rel="stylesheet">
    <link href="<%= global.config.publicPath %>/uedit/themes/default/css/umeditor.css" type="text/css" rel="stylesheet">
    <style>
        #imageShowBody{
            width: 100%;
        }
    </style>
</head>
<body>
<% include ../common/header.ejs %>

<div class="container page-content">
    <div class="panel panel-default" style="width: 80%;">
        <div class="panel-heading">
            <h3 class="panel-title">
                <span class="glyphicon glyphicon-th-list" aria-hidden="true"></span>
                新闻编辑
            </h3>
        </div>
        <div class="panel-body">
            <form class="form-horizontal" id="form">
                <input type="hidden" name="id" id="_pk_id"/>

                <div class="dolphin-row">
                    <div class="dolphin-col-12">
                        <div class="form-group">
                            <label class="col-sm-4 control-label">标题</label>

                            <div class="col-sm-8">
                                <input type="text" class="form-control" name="name"/>
                            </div>
                        </div>
                    </div>
                    <div class="dolphin-col-12">
                        <div class="form-group">
                            <label class="col-sm-4 control-label">生效时间</label>
                            <div class="col-sm-8">
                                <div class="input-group date dolphin_date_picker">
                                    <input type="text" class="form-control" name="activeTime">
                                    <span class="input-group-addon">
                                        <i class="glyphicon glyphicon-th"></i>
                                    </span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="dolphin-col-12">
                        <div class="form-group">
                            <label class="col-sm-4 control-label">失效时间</label>
                            <div class="col-sm-8">
                                <div class="input-group date dolphin_date_picker">
                                    <input type="text" class="form-control" name="expireTime">
                                    <span class="input-group-addon">
                                        <i class="glyphicon glyphicon-th"></i>
                                    </span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="dolphin-col-12">
                        <div class="form-group">
                            <label class="col-sm-4 control-label">排序号</label>
                            <div class="col-sm-8">
                                <input type="text" class="form-control" name="rowNum" placeholder="大号优先"/>
                            </div>
                        </div>
                    </div>
                    <div class="dolphin-col-12">
                        <div class="form-group">
                            <label class="col-sm-4 control-label">摘要</label>
                            <div class="col-sm-8">
                                <textarea name="remark" rows="2" class="form-control"></textarea>
                            </div>
                        </div>
                    </div>
                </div>
                <input type="hidden" name="cover" id="cover"/>
            </form>
        </div>
    </div>
    <div class="panel panel-info" style="width: 80%;">
        <div class="panel-heading">
            <h3 class="panel-title">
                <span class="glyphicon glyphicon-picture" aria-hidden="true"></span>
                封面图片
            </h3>
        </div>
        <div class="panel-body">
            <form class="form-horizontal">
                <span class="btn btn-success fileinput-button"><i class="glyphicon glyphicon-plus"></i>
                    <span>图片选择</span>
                    <input id="fileupload" type="file" name="upfile" multiple>
                </span>
                <div class="dolphin-row">
                    <div class="dolphin-col-8" id="imageAttrPanelBody"></div>
                    <div class="dolphin-col-16">
                        <img style="width: 30%;height: 30%;" id="imageShowBody"/>
                    </div>
                </div>
            </form>
        </div>
    </div>
    <div>
        <script type="text/plain" id="myEditor" style="width:1000px;height:240px;"></script>
    </div>
    <div class="form-group" style="padding-top: 10px;">
        <div class="col-sm-10">
            <button type="button" class="btn btn-primary" onclick="submitFunc()">保存</button>
            <button type="button" class="btn btn-default" onclick="Dolphin.goHistory(-1)">取消</button>
        </div>
    </div>
</div>
<% include ../common/footer.ejs %>
<script src="<%= global.config.publicPath %>/jquery-file-upload/js/vendor/jquery.ui.widget.js"></script>
<script src="<%= global.config.publicPath %>/jquery-file-upload/js/jquery.fileupload.js"></script>
<script src="//cdn.bootcss.com/bootstrap-datepicker/1.6.1/js/bootstrap-datepicker.min.js"></script>
<script src="<%= global.config.publicPath %>/uedit/umeditor.config.js"></script>
<script src="<%= global.config.publicPath %>/uedit/umeditor.min.js"></script>
<script src="<%= global.config.publicPath %>/uedit/lang/zh-cn/zh-cn.js"></script>
<script>
    var um;
    $(function () {
        Dolphin.form.parse();
        um = UM.getEditor('myEditor', {
            imageUrl: "<%= global.config.contextPath=='/'?'': global.config.contextPath%>/file/"
            , imagePath: "/uploadFiles"
            , imageFieldName: "upfile"
        });
        $('#fileupload').fileupload({
            url: '<%= global.config.contextPath=='/'?'': global.config.contextPath%>/file/',
            dataType: 'json',
            done: function (e, data) {
                $("#cover").val(data.result.url);
                $("#imageShowBody").attr("src", '/uploadFiles'+data.result.url);
            },
            progressall: function (e, data) {
            }
        });

        var pkId = yams.context.queryData.id;
        if (pkId) {
            Dolphin.ajax({
                url: "/api/369cf93b979a4569887d3839b806b0fd@id=" + pkId,
                type: Dolphin.requestMethod.GET,
                onSuccess: function (reData) {
                    Dolphin.form.setValue(reData.value, '#form');
                    if (reData.value['uedit'])
                        um.setContent(reData.value['uedit']);
                    $("#imageShowBody").attr('src', '/uploadFiles'+reData.value.cover);
                }
            });
        }

    });
    function submitFunc() {
        var data = Dolphin.form.getValue("form");
        data['model'] = {"id": yams.context.queryData.modelId};
        data['uedit'] = um.getContent();
        if (data['activeTime'])
            data['activeTime'] = data['activeTime'] + " 00:00:00";
        if (data['expireTime'])
            data['expireTime'] = data['expireTime'] + " 23:59:59";
        Dolphin.ajax({
            url: "/api/c97b00aa70fc4ed1b5922bced4468a0b",
            type: Dolphin.requestMethod.PUT,
            data: Dolphin.json2string(data),
            onSuccess: function (reData) {
                Dolphin.alert(reData.msg || '保存成功', {
                    callback: function () {
                        Dolphin.goHistory();
                    }
                })
            }
        });
    }
</script>
</body>
</html>
